import { defineComponent, h, renderSlot, type PropType } from 'vue';
import Card from 'ant-design-vue/lib/card';
import { type NodeItem } from '/@/views/formDesigner/core/types/epic-designer';
export default defineComponent({
  props: {
    record: {
      type: Object as PropType<NodeItem>,
      require: true,
      default: () => ({}),
    },
  },
  setup(props, { attrs, slots }) {
    return () => {
      const record = {
        ...props.record,
        title: props.record?.label ?? '',
      } as Record<string, any>;
      const children = record.children ?? [];
      delete record.children;

      return h(Card, record, {
        default: () =>
          renderSlot(slots, 'edit-node', {}, () =>
            children.map((record: any) => renderSlot(slots, 'node', { record })),
          ),
      });
    };
  },
});
